﻿
@{
    ViewBag.Title = "关于本站";
}

@section css{
<link href="~/css/homePage/about.css" rel="stylesheet" />
}

<div class="blog-container">
    @*站点导航路径*@
    <div class="layui-elem-quote sitemap layui-breadcrumb shadow" lay-separator=">">
        <a href="/" title="网站首页">网站首页</a>
        <a><cite>关于本站</cite></a>
    </div>
    <div class="blog-main">
        <div class="layui-tab layui-tab-brief shadow" lay-filter="tabAbout">
            @*选项卡 选择项*@
            <ul class="layui-tab-title">
                <li lay-id="1">关于博客</li>
                <li lay-id="2">关于作者</li>
                <li lay-id="3" id="friendlink">友情链接</li>
                <li lay-id="4">留言墙</li>
            </ul>
            @*选项卡 对应内容项*@
            <div class="layui-tab-content">
                @*关于博客*@
                <div class="layui-tab-item">
                    <div class="aboutinfo">
                        <div class="aboutinfo-figure">
                            <img src="~/images/face/30.gif" alt="lsp" />
                        </div>
                        <p class="aboutinfo-nickname">lsp</p>
                        <p class="aboutinfo-introduce">一个.NET 程序猿写博客的记录</p>
                        <p class="aboutinfo-location"><i class="fa fa-link"></i>&nbsp;&nbsp;<a target="_blank" href="javascript:layer.msg('瞎点什么');">有一个链接</a></p>
                        @*分割线*@
                        <hr />
                        <div class="aboutinfo-contact">
                            <a target="_blank" title="网站首页" href="/"><i class="fa fa-home fa-2x" style="font-size:2.5em;position:relative;top:3px;"></i></a>
                            <a target="_blank" title="文章专栏" href="/Article"><i class="fa fa-file-text fa-2x"></i></a>
                            <a target="_blank" title="资源分享" href="/Resource"><i class="fa fa-tags fa-2x"></i></a>
                            <a target="_blank" title="点点滴滴" href="/TimeLine"><i class="fa fa-hourglass-half fa-2x"></i></a>
                        </div>

                        <fieldset class="layui-elem-field layui-field-title">
                            <legend>简介</legend>
                            <div class="layui-field-box aboutinfo-abstract">
                                <p style="text-align:center;">这是一个有ASP.NE开发的个人博客网站，使用了开源模板</p>
                                <p>第一个版本</p>
                                <p>诞生的版本，采用ASP.NET MVC + Entity Framework 作为后台框架，使用LayUI进行布局</p>
                                <h1>第二个版本</h1>
                                <p>使用EF进行数据查询</p>
                                <h1>当前版本</h1>
                                <p>使用Layre弹窗插件，使用LayUI前端框架</p>
                                <h1 style="text-align:center;">The End</h1>
                            </div>
                        </fieldset>
                    </div>
                </div>

                @*关于作者*@
                <div class="layui-tab-item">
                    <div class="aboutinfo">
                        <div class="aboutinfo-figure">
                            <img src="~/images/face/15.gif" alt="lsp" />
                        </div>
                        <p class="aboutinfo-nickname">LSP</p>
                        <p class="aboutinfo-introduce">一枚90后程序猿，.NET开发工程师，主攻B/S架构，略懂前端</p>
                        <p class="aboutinfo-location"><i class="fa fa-location-arrow">&nbsp;广东 - 广州</i></p>
                        <hr />
                        <div class="aboutinfo-contact">
                            <a target="_blank" title="QQ交流" href="javascript:layer.msg('启动QQ会话窗口')"><i class="fa fa-qq fa-2x"></i></a>
                            <a target="_blank" title="给我写信" href="javascript:layer.msg('启动邮我窗口')"><i class="fa fa-envelope fa-2x"></i></a>
                            <a target="_blank" title="新浪微博" href="javascipt:layer.msg('转到你的微博主页')"><i class="fa fa-weibo fa-2x"></i></a>
                            <a target="_blank" title="码云" href="javascript:layer.msg('转到你的GitHub主页')"><i class="fa fa-git fa-2x"></i></a>
                        </div>
                        <fieldset class="layui-elem-field layui-field-title">
                            <legend>简介</legend>
                            <div class="layui-field-box aboutinfo-abstract abstract-bloger">
                                <p style="text-align:center;">LSP，从事.NET开发的码农</p>
                                <h1>个人信息</h1>
                                <p>暂无</p>
                                <h1>个人介绍</h1>
                                <p>一个有酒没故事的男同学，没什么介绍...</p>
                                <h1 style="text-align:center;">The End</h1>
                            </div>
                        </fieldset>
                    </div>
                </div>

                @*友情链接*@
                <div class="layui-tab-item">
                    <div class="aboutinfo">
                        <div class="aboutinfo-figure">
                            <img src="~/images/face/13.gif" alt="友情链接" />
                        </div>
                        <p class="aboutinfo-nickname">友情链接</p>
                        <p class="aboutinfo-introduce">Name: LSP&nbsp;&nbsp;&nbsp;&nbsp;Site: www.lsp.cn</p>
                        <p class="aboutinfo-location">
                            <i class="fa fa-close"></i>经常宕机&nbsp;
                            <i class="fa fa-close"></i>不合法规&nbsp;
                            <i class="fa fa-close"></i>擦边球站&nbsp;
                            <i class="fa fa-close"></i>红标报毒&nbsp;
                            <i class="fa fa-check"></i>原创优先&nbsp;
                            <i class="fa fa-check"></i>技术优先&nbsp;
                        </p>
                        <hr />
                        <div class="aboutinfo-contact">
                            <p style="font-size:2em">互换友链，携手并进</p>
                        </div>
                        <fieldset class="layui-elem-field layui-field-title">
                            <legend>Friend Link</legend>
                            <div class="layui-field-box">
                                <ul class="friendlink">
                                    <li>
                                        <a target="_blank" href="http://www.layui.com/" title="Layui" class="friendlink-item">
                                            <p class="friendlink-item-pic"><img src="http://img03.sogoucdn.com/app/a/100520024/2181df96f208930caf133ad4c34bcc7a" alt="girl" /></p>
                                            <p class="friendlink-item-title">Layui</p>
                                            <p class="friendlink-item-domain">layui.com</p>
                                        </a>
                                    </li>
                                    <li>
                                        <a target="_blank" href="http://www.pagemark.com/" title="页签" class="friendlink-item">
                                            <p class="friendlink-item-pic"><img src="http://img03.sogoucdn.com/app/a/100520024/2181df96f208930caf133ad4c34bcc7a" alt="girl" /></p>
                                            <p class="friendlink-item-title">页签</p>
                                            <p class="friendlink-item-domain">pagemark.com</p>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </fieldset>
                    </div>
                </div>

                @*留言墙*@
                <div class="layui-tab-item">
                    <div class="aboutinfo">
                        <div class="aboutinfo-figure">
                            <img src="~/images/face/21.gif" alt="留言墙" />
                        </div>
                        <p class="aboutinfo-nickname">留言墙</p>
                        <p class="aboutinfo-introduce">本页面可留意、吐槽、提问。欢迎灌水，杜绝广告</p>
                        <p class="aboutinfo-location">
                            <i class="fa fa-clock-o"></i>&nbsp;<span id="time"></span>
                        </p>
                        <hr />
                        <div class="aboutinfo-contact">
                            <p style="font-size:2em">沟通交流，拉近你我！</p>
                        </div>
                        <fieldset class="layui-elem-field layui-field-title">
                            <legend>Leave a message</legend>
                            <div class="layui-field-box">
                                <div class="leavemessage" style="text-align:initial">
                                    @*富文本编辑器*@
                                    <form class="layui-form blog-editor" action="">
                                        <div class="layui-form-item">
                                            <textarea name="editorContent" lay-verify="content" id="remarkEditor" placeholder="请输入内容" class="layui-textarea layui-hide"></textarea>
                                        </div>
                                        <div class="layui-form-item">
                                            <button class="layui-btn" lay-submit="formLeaveMessage" lay-filter="formLeaveMessage">提交留言</button>
                                        </div>
                                    </form>
                                    @*留言列表*@
                                    <ul class="blog-comment">
                                        <li>
                                            @*留言内容*@
                                            <div class="comment-parent">
                                                <img src="~/images/face/10.gif" alt="lsp" />
                                                <div class="info">
                                                    <span class="username">lsp</span>
                                                </div>
                                                <div class="content">
                                                    模拟留言与回复
                                                </div>
                                                <p class="info info-footer"><span class="time">2018-2-6 16:10:44</span><a class="btn-reply" href="javascript:;" onclick="btnReplyClick(this)">回复</a></p>
                                            </div>
                                            <hr />
                                            @*留言回复列表*@
                                            <div class="comment-child">
                                                <img src="~/images/face/1.gif" alt="lsp" />
                                                <div class="info">
                                                    <span class="username">lsp</span><span>这是用户回复内容</span>
                                                </div>
                                                <p class="info"><span class="time">2018-2-6 16:16:03</span></p>
                                            </div>
                                            <div class="comment-child">
                                                <img src="~/images/face/11.gif" alt="lsp" />
                                                <div class="info">
                                                    <span class="username">lsp</span><span>这是第二个用户回复内容</span>
                                                </div>
                                                <p class="info"><span class="time">2018-2-6 16:19:24</span></p>
                                            </div>
                                            @*回复表单默认隐藏*@
                                            <div class="replycontainer layui-hide">
                                                <form class="layui-form" action="">
                                                    <div class="layui-form-item">
                                                        <textarea name="replyContent" lay-verify="replyContent" placeholder="请输入回复内容" class="layui-textarea" style="min-height:80px;"></textarea>
                                                    </div>
                                                    <div class="layui-form-item">
                                                        <button class="layui-btn layui-btn-sm" lay-submit="formReply" lay-filter="formReply">提交</button>
                                                    </div>
                                                </form>
                                            </div>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </fieldset>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@section scripts{
<script src="~/js/homePage/about.js"></script>
    }

